<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="style1.css">
    <link rel="shortcut icon" href="img/favicon.ico">
</head>
<body>
    
    <section>
        
        <!-- 登录 -->

        <div class="container">
            <div class="user singinBx">
                <div class="imgBx"><img src="img/wjh4.jpg" alt=""></div>
                <div class="formBx">
                    <form action="">
                        <h2>登录</h2>
                        <input type="text" name="" placeholder="用户名">
                        <input type="password" name="" placeholder="密码">
                        <input type="submit" name="" value="登录" onclick="return checkForm();">
                        <p class="signup">没有账号？<a href="#" onclick="topggleForm();">注册</a>     </p>
                    </form>
                </div>
            </div>

            <!-- 注册 -->

            <div class="user singupBx">
                <div class="formBx">
                    <form action="">
                        <h2>注册</h2>
                        <input type="text" name="" placeholder="用户名">
                        <input type="email" name="" placeholder="邮箱地址">
                        <input type="password" name="" placeholder="密码">
                        <input type="password" name="" placeholder="再次输入密码">
                        <input type="submit" name="" value="注册">
                        <p class="signup">已有账号？<a href="#" onclick="topggleForm();">登录</a> </p>
                    </form>
                </div>
                <div class="imgBx"><img src="img/wjh2.jpg" alt=""></div>
            </div>

        </div>
    </section>
    
    <script type="text/javascript">
        function topggleForm(){
            var container = document.querySelector('.container');
            container.classList.toggle('active');
        }
       
    </script>
    <script>
        function checkForm() {
            var username = document.querySelector('input[name=""]').value;
            var password = document.querySelector('input[type="password"]').value;
            if (username === "chengpp" && password === "wjh1314520") {
                window.location.href = 'try.html'; // 跳转到try.html页面
               
                return false; // 阻止表单默认提交行为
            } else {
                alert('用户名或密码错误，请重试！'); // 提示用户用户名或密码错误
                return false; // 阻止表单默认提交行为
            }
        }
    </script>
    
</body>
</html>
